<!--
 * @Descripttion: 
 * @version: 
 * @Author: mmzhang
 * @Date: 2021-07-21 10:45:02
 * @LastEditTime: 2022-12-09 10:09:28
-->
<template>
  <div class="subscription-list">
    <dt-search ref="search" :labelWidth="100" :xl="4" @reset="resetFun">
      <Button type="primary" style="margin-left: 10px">
        <a
          href="https://images.tospurfang.com/doc/%E7%AD%BE%E7%BA%A6%E5%8D%95%E9%99%84%E4%BB%B6%E8%A1%A5%E4%BC%A0%E6%93%8D%E4%BD%9C%E8%AF%B4%E6%98%8E.pdf"
          style="color: #fff"
          target="_blank">
          查看操作指引
        </a>
      </Button>
    </dt-search>
    <div>
      <Tabs type="card" v-model="showTab" :animated="false" @on-click="onChangeTab">
        <TabPane label="待审核" name="1"></TabPane>
        <TabPane label="已审核" name="2"></TabPane>
      </Tabs>
      <dt-grid ref="table" :page="page" :onFetch="onFetch" />
    </div>
    <!--客户详情-->
    <Modal v-model="detailsFlag" title="客户详情" width="80%" :styles="{ top: '5%' }" :footer-hide="true">
      <detail-page v-if="detailsFlag" :detailsParams="detailsParams"></detail-page>
    </Modal>
    <!--审核-->
    <examine-page ref="examinePage" :annexId="annexId" @onSearch="searchFun()"></examine-page>
  </div>
</template>
<script>
  import ConEncloseColumn from './components/contractColumn'
  import orderEncloseMgr from '@/biz/flowApproval/orderEnclose'
  import detailPage from '../../allCustomersManagement/details.vue'
  import examinePage from './components/examinePage.vue'
  import searchOpt from './components/search'
  import dt from '@dt/dt'
  let filter = null
  let auditAnnexId = null

  export default {
    data() {
      return {
        annexId: '', // 列表id
        showTab: '1',
        detailsFlag: false,
        detailsParams: {},
        searchInfo: {
          auditResults: '', //状态
          productId: '', //产品
          buildingId: '',
          unitId: '',
          roomCode: ''
        },
        page: {
          rows: 50,
          current: 1
        },
        filterParams: {}
      }
    },
    components: {
      detailPage,
      examinePage
    },
    beforeRouteEnter(to, from, next) {
      if (from.name != 'contractDetail') {
        dt.memory.remove('contractEnclose_params')
        filter = null
      }
      next()
    },
    mounted() {
      let _this = this
      // 待办跳转
      auditAnnexId = this.$route.params.businessId || null
      let retainParams = dt.memory.get('contractEnclose_params')
      this.showTab = this.$route.params.showTab ? this.$route.params.showTab : '1'

      this.$refs.table.init(this, new ConEncloseColumn(this))
      this.$refs.search.init(this.$refs.table, new searchOpt(this).options(), this.searchInfo)

      this.$nextTick(function () {
        if (retainParams) {
          Object.keys(this.searchInfo).map(function (key) {
            retainParams[key] && (_this.searchInfo[key] = retainParams[key]) //比较key
          })
          _this.showTab = retainParams.showTab ? retainParams.showTab : '1'
          retainParams.rows && (this.page.rows = retainParams.rows)
          retainParams.page && (this.page.current = retainParams.page)
        }
        filter && _this.$refs.table.throwFilter().import(filter)
      })

      this.$refs.table.fetch()
    },
    methods: {
      resetFun() {
        auditAnnexId = null
        dt.memory.remove('contractEnclose')
        this.$refs.search.init(this.$refs.table, new searchOpt(this), this.searchInfo)
      },
      onFetch(data) {
        data.status = this.showTab // 订单状态 已审核 传2,3都可
        data.housesId = dt.buildInfo().housesId
        data.orderType = 'CONTRACT' // 订单类别
        data.auditAnnexId = auditAnnexId
        dt.memory.get('contractEnclose')?.UContainSelf !== undefined &&
          (data.containSelf = !dt.memory.get('contractEnclose'))
        this.filterParams = {
          ...data
        }
        return orderEncloseMgr
          .getEncloseExamineList(data)
          .then((res) => {
            return res
          })
          .catch((err) => {})
      },
      // 切换tab
      onChangeTab() {
        this.$refs.table.update(new ConEncloseColumn(this))
        this.$refs.search.update(new searchOpt(this))
        this.$refs.table.fetch(true)
      },
      // 保留列表查询参数
      retainParamsFun() {
        let params = Object.assign({ showTab: this.showTab }, this.filterParams)
        dt.memory.set('contractEnclose_params', params)
        filter = this.$refs.table.throwFilter().export()
      },
      // 客户姓名链接到客户资料
      onLinkUser(row) {
        if (row.customerName == '-') {
          return false
        }
        this.detailsFlag = true
        this.detailsParams = {
          customerId: row.customerId,
          userCustomerId: row.userCustomerId,
          buildingId: this.$dt.buildInfo().housesId,
          userId: row.userId,
          cityCode: this.$dt.buildInfo().cityId
        }
      },
      // 查看
      viewFun(row) {
        this.retainParamsFun()
        this.$router.push({
          name: 'contractDetail',
          query: {
            examineBtn: false,
            orderStatusName: '签约',
            orderNum: row.orderCode, // 单号
            businessId: row.orderId // 业务id
          }
        })
      },
      //  审核
      examineFun(row) {
        this.annexId = row.annexId
        this.$refs.examinePage.show()
      },
      // 搜索
      searchFun() {
        this.$refs.table.fetch(true)
      }
    }
  }
</script>
<style lang="scss" scoped>
  .subscription-list {
    padding: 20px;
  }
</style>
